﻿<%@ Page Title="Gems" Language="C#" MasterPageFile="~/GEMS.master" AutoEventWireup="true"
    CodeFile="index.aspx.cs" Inherits="index" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link href="css/lightbox/jquery.fancybox.css" rel="stylesheet" type="text/css" />
    <script src="js/lightbox/jquery.mousewheel-3.0.6.pack.js" type="text/javascript"></script>
    <script src="js/lightbox/jquery.fancybox.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".fancybox-effects-c").fancybox({
                wrapCSS: 'fancybox-custom',
                closeClick: true,

                openEffect: 'none',
                closeBtn: true,

                prevEffect: 'none',
                nextEffect: 'none',

                afterLoad: function () {
                    this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
                },

                helpers: {
                    title: {
                        type: 'inside'
                    },
                    overlay: {
                        css: {
                            'background': 'rgba(238,238,238,0.85)'
                        }
                    }
                }
            });

        });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div class="container960">
        <!-- Main -->
        <div id="main">
            <div class="cl">
                &nbsp;</div>
            <!-- Content -->
            <div id="content">
                <!-- Content Slider -->
                <div class="slider-wrapper theme-default box">
                    <div id="slider" class="nivoSlider">
                        <img src="css/images/slide3.jpg" alt="" />
                        <img src="css/images/slide2.jpg" alt="" />
                        <img src="css/images/slide1.jpg" alt="" />
                    </div>
                </div>
                <!-- End Content Slider -->
                <!-- Products -->
                <div class="products">
                    <div class="cl">
                        &nbsp;</div>
                    <ul>
                        <asp:DataList ID="dtlist" runat="server" RepeatColumns="5" CellSpacing="6" CssClass="pro">
                            <ItemTemplate>
                                <li>
                                    <asp:HyperLink ID="HyperLink3" runat="server" NavigateUrl="css/images/big1.jpg" data-fancybox-group="button"
                                        class="fancybox-effects-c">
                                        <asp:Image ID="Image1" ImageUrl='<%# Bind("Name", "~/P_Images/{0}") %>' runat="server" />
                                    </asp:HyperLink>
                                    <a href="css/images/big2.jpg" data-fancybox-group="button" class="fancybox-effects-c"
                                        style="display: none;">
                                        <asp:Image ID="Image2" ImageUrl='<%# Bind("Name", "~/P_Images/{0}") %>' runat="server" />
                                    </a>
                                    <div class="pro_intro">
                                        <asp:HyperLink ID="HyperLink2" runat="server"> <span class="pro_name">Madagascar </span> </a></asp:HyperLink>
                                        <span class="pro_price">Price : 400 </span>
                                        <asp:HyperLink ID="HyperLink1" NavigateUrl="orderPlacing.aspx" runat="server"><span class="pro_view">View </span></asp:HyperLink>
                                    </div>
                                </li>
                            </ItemTemplate>
                        </asp:DataList>
                    </ul>
                    <div class="cl">
                        &nbsp;</div>
                </div>
                <!-- End Products -->
            </div>
            <!-- End Content -->
            <!-- Sidebar -->
            <div id="sidebar">
                <!-- Search -->
                <div class="box search">
                    <h2>
                        Search by <span></span>
                    </h2>
                    <div class="box-content">
                        <label>
                            Keyword</label>
                        <asp:TextBox ID="txtKeyword" CssClass="field" runat="server"></asp:TextBox>
                        <label>
                            Category</label>
                        <asp:DropDownList ID="ddl_Category" CssClass="field" runat="server">
                            <asp:ListItem>-- Select Category --</asp:ListItem>
                        </asp:DropDownList>
                        <div class="inline-field">
                            <span>Price:</span>
                            <asp:DropDownList ID="ddl_Pricefrom" CssClass="field small-field" runat="server">
                                <asp:ListItem>10</asp:ListItem>
                            </asp:DropDownList>
                            &nbsp;&nbsp; <span>To:</span>
                            <asp:DropDownList ID="ddl_Priceto" CssClass="field small-field" runat="server">
                                <asp:ListItem>50</asp:ListItem>
                            </asp:DropDownList>
                        </div>
                        <asp:Button ID="Button1" runat="server" Style="margin-left: 140px;" CssClass="search-submit"
                            Text="Search" />
                        <p>
                            <asp:LinkButton ID="lnkad" class="bul" runat="server" CausesValidation="false">Advanced search</asp:LinkButton>
                            <cc1:ModalPopupExtender ID="mp1" runat="server" PopupControlID="Panel1" TargetControlID="lnkad"
                                CancelControlID="btnClose" BackgroundCssClass="modalBackground">
                            </cc1:ModalPopupExtender>
                            <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" align="Left" Style="display: none;width:360px">
                                <div id="dialog" style="background-color: #ffffff; border: 2px solid #7F7F7F">
                                    <div class="web_dialog_title ">
                                        Advance Search
                                        <asp:LinkButton ID="btnClose" runat="server" CssClass="button" Font-Underline="false"
                                            Text="X" Font-Bold="true"></asp:LinkButton></div>
                                    <div class="loginpop">
                                        <div class="row">
                                            <div class="leftcol grid_2">
                                                <span>Weight</span>
                                            </div>
                                            <div class="rightcol">
                                                <asp:TextBox ID="TextBox1" runat="server" CssClass="field" MaxLength="20"></asp:TextBox></div>
                                        </div>
                                        <div class="row">
                                            <div class="leftcol grid_2">
                                                <span>Color</span>
                                            </div>
                                            <div class="rightcol">
                                                <asp:DropDownList ID="DropDownList1" CssClass="select_field field" Style="width: 186px"
                                                    runat="server">
                                                    <asp:ListItem>Red</asp:ListItem>
                                                    <asp:ListItem>Blue</asp:ListItem>
                                                    <asp:ListItem>Green</asp:ListItem>
                                                </asp:DropDownList>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="leftcol grid_2">
                                                <span>Clarity</span>
                                            </div>
                                            <div class="rightcol">
                                                <asp:TextBox ID="TextBox2" runat="server" CssClass="field" MaxLength="20"></asp:TextBox></div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="leftcol">
                                            &nbsp;</div>
                                        <div class="rightcol">
                                            <div class="sub">
                                                <asp:Button ID="Button2" runat="server" Text="Submit" class="lgin" />
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </asp:Panel>
                        </p>
                    </div>
                </div>
                <!-- End Search -->
                <!-- Categories -->
                <div class="box categories">
                    <h2>
                        Categories <span></span>
                    </h2>
                    <div class="box-content">
                        <ul>
                            <li><a href="#">Category 1</a></li>
                            <li><a href="#">Category 2</a></li>
                            <li><a href="#">Category 3</a></li>
                            <li><a href="#">Category 4</a></li>
                            <li><a href="#">Category 5</a></li>
                            <li><a href="#">Category 6</a></li>
                            <li><a href="#">Category 7</a></li>
                            <li><a href="#">Category 8</a></li>
                            <li><a href="#">Category 9</a></li>
                            <li><a href="#">Category 10</a></li>
                            <li><a href="#">Category 11</a></li>
                            <li><a href="#">Category 12</a></li>
                            <li class="last"><a href="#">Category 13</a></li>
                        </ul>
                    </div>
                </div>
                <!-- End Categories -->
            </div>
            <!-- End Sidebar -->
            <div class="cl">
                &nbsp;</div>
        </div>
        <!-- End Main -->
        <!-- Side Full -->
        <div class="side-full">
            <!-- More Products -->
            <div class="more-products">
                <div class="more-products-holder">
                    <ul id="foo2">
                        <li><a href="#">
                            <img src="css/images/small1.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small2.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small3.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small1.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small2.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small3.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small1.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small2.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small3.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small1.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small2.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small3.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small1.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small2.jpg" alt="" /></a></li>
                        <li><a href="#">
                            <img src="css/images/small3.jpg" alt="" /></a></li>
                    </ul>
                </div>
                <div class="more-nav">
                    <a href="#" id="foo2_prev" class="prev">previous</a> <a href="#" id="foo2_next" class="next">
                        next</a>
                </div>
            </div>
            <!-- End More Products -->
            <!-- Text Cols -->
            <div class="cols">
                <div class="cl">
                    &nbsp;</div>
                <div class="col">
                    <h3 class="ico ico1">
                        Congenial Studioss</h3>
                    <p>
                        Congenial Studioss is one among the developing companies, established in the year
                        2009. CS proudly owns one among the best Teams in the World.</p>
                    <p class="more">
                        <a href="#" class="bul">Read more</a></p>
                </div>
                <div class="col">
                    <h3 class="ico ico2">
                        Congenial Studioss</h3>
                    <p>
                        Congenial Studioss is one among the developing companies, established in the year
                        2009. CS proudly owns one among the best Teams in the World.</p>
                    <p class="more">
                        <a href="#" class="bul">Read more</a></p>
                </div>
                <div class="col">
                    <h3 class="ico ico3">
                        Congenial Studioss</h3>
                    <p>
                        Congenial Studioss is one among the developing companies, established in the year
                        2009. CS proudly owns one among the best Teams in the World.</p>
                    <p class="more">
                        <a href="#" class="bul">Read more</a></p>
                </div>
                <div class="col col-last">
                    <h3 class="ico ico4">
                        Congenial Studioss</h3>
                    <p>
                        Congenial Studioss is one among the developing companies, established in the year
                        2009. CS proudly owns one among the best Teams in the World.</p>
                    <p class="more">
                        <a href="#" class="bul">Read more</a></p>
                </div>
                <div class="cl">
                    &nbsp;</div>
            </div>
            <!-- End Text Cols -->
        </div>
        <!-- End Side Full -->
    </div>
</asp:Content>
